
import 'package:flutter/material.dart';
import '../../widget/PPBaseWidget.dart';
import './widget/PPInterestOptionsTopicalItem.dart';
import './widget/PPInterestOptionsPostItem.dart';

class PPInterestOptionsPage extends StatefulWidget with PPBaseWidget {

    PPInterestOptionsPage({ Key key, this.title }): super(key: key);

    final String title;

    _PPInterestOptionsPageState createState() => _PPInterestOptionsPageState();
}

class _PPInterestOptionsPageState extends State<PPInterestOptionsPage> {

    List<Map> topicalData = [
        { "type": "热门", "title": "热门", "isSelect": true, "postData": [
            { "subType": "传单派发0", "title": "传单派发0", "isSelect": false }, 
            { "subType": "临时工0", "title": "临时工0", "isSelect": false }, 
            { "subType": "服务员0", "title": "服务员0", "isSelect": false }, 
            { "subType": "家教助教0", "title": "家教助教0", "isSelect": false }, 
            { "subType": "快递配送0", "title": "快递配送0", "isSelect": false }
        ]},
        { "type": "简单易做", "title": "简单易做", "isSelect": false, "postData": [
            { "subType": "传单派发1", "title": "传单派发1", "isSelect": false }, 
            { "subType": "临时工1", "title": "临时工1", "isSelect": false }, 
            { "subType": "服务员1", "title": "服务员1", "isSelect": false }, 
            { "subType": "家教助教1", "title": "家教助教1", "isSelect": false }, 
            { "subType": "快递配送1", "title": "快递配送1", "isSelect": false }
        ]},
        { "type": "室内推荐", "title": "室内推荐", "isSelect": false , "postData": [
            { "subType": "传单派发2", "title": "传单派发2", "isSelect": false }, 
            { "subType": "临时工2", "title": "临时工2", "isSelect": false }, 
            { "subType": "服务员2", "title": "服务员2", "isSelect": false }, 
            { "subType": "家教助教2", "title": "家教助教2", "isSelect": false }, 
            { "subType": "快递配送2", "title": "快递配送2", "isSelect": false }
        ]},
        { "type": "体力达人", "title": "体力达人", "isSelect": false , "postData": [
            { "subType": "传单派发3", "title": "传单派发3", "isSelect": false }, 
            { "subType": "临时工3", "title": "临时工3", "isSelect": false }, 
            { "subType": "服务员3", "title": "服务员3", "isSelect": false }, 
            { "subType": "家教助教3", "title": "家教助教3", "isSelect": false }, 
            { "subType": "快递配送3", "title": "快递配送3", "isSelect": false }
        ]},
        { "type": "专业技能", "title": "专业技能", "isSelect": false , "postData": [
            { "subType": "传单派发4", "title": "传单派发4", "isSelect": false }, 
            { "subType": "临时工4", "title": "临时工4", "isSelect": false }, 
            { "subType": "服务员4", "title": "服务员4", "isSelect": false }, 
            { "subType": "家教助教4", "title": "家教助教4", "isSelect": false }, 
            { "subType": "快递配送4", "title": "快递配送4", "isSelect": false }
        ]},
        { "type": "跑腿办事", "title": "跑腿办事", "isSelect": false , "postData": [
            { "subType": "传单派发5", "title": "传单派发5", "isSelect": false }, 
            { "subType": "临时工5", "title": "临时工5", "isSelect": false }, 
            { "subType": "服务员5", "title": "服务员5", "isSelect": false }, 
            { "subType": "家教助教5", "title": "家教助教5", "isSelect": false }, 
            { "subType": "快递配送5", "title": "快递配送5", "isSelect": false }
        ]},
        { "type": "演绎达人", "title": "演绎达人", "isSelect": false , "postData": [
            { "subType": "传单派发6", "title": "传单派发6", "isSelect": false }, 
            { "subType": "临时工6", "title": "临时工6", "isSelect": false }, 
            { "subType": "服务员6", "title": "服务员6", "isSelect": false }, 
            { "subType": "家教助教6", "title": "家教助教6", "isSelect": false }, 
            { "subType": "快递配送6", "title": "快递配送6", "isSelect": false }
        ]},
    ];
    Map<String, List<Map>> postData = {
        "热门": [
            { "subType": "传单派发0", "title": "传单派发0", "isSelect": false }, 
            { "subType": "临时工0", "title": "临时工0", "isSelect": false }, 
            { "subType": "服务员0", "title": "服务员0", "isSelect": false }, 
            { "subType": "家教助教0", "title": "家教助教0", "isSelect": false }, 
            { "subType": "快递配送0", "title": "快递配送0", "isSelect": false }
        ],
        "简单易做": [
            { "subType": "传单派发1", "title": "传单派发1", "isSelect": false }, 
            { "subType": "临时工1", "title": "临时工1", "isSelect": false }, 
            { "subType": "服务员1", "title": "服务员1", "isSelect": false }, 
            { "subType": "家教助教1", "title": "家教助教1", "isSelect": false }, 
            { "subType": "快递配送1", "title": "快递配送1", "isSelect": false }
        ],
        "室内推荐": [
            { "subType": "传单派发2", "title": "传单派发2", "isSelect": false }, 
            { "subType": "临时工2", "title": "临时工2", "isSelect": false }, 
            { "subType": "服务员2", "title": "服务员2", "isSelect": false }, 
            { "subType": "家教助教2", "title": "家教助教2", "isSelect": false }, 
            { "subType": "快递配送2", "title": "快递配送2", "isSelect": false }
        ],      
        "体力达人": [
            { "subType": "传单派发3", "title": "传单派发3", "isSelect": false }, 
            { "subType": "临时工3", "title": "临时工3", "isSelect": false }, 
            { "subType": "服务员3", "title": "服务员3", "isSelect": false }, 
            { "subType": "家教助教3", "title": "家教助教3", "isSelect": false }, 
            { "subType": "快递配送3", "title": "快递配送3", "isSelect": false }
        ], 
        "专业技能": [
            { "subType": "传单派发4", "title": "传单派发4", "isSelect": false }, 
            { "subType": "临时工4", "title": "临时工4", "isSelect": false }, 
            { "subType": "服务员4", "title": "服务员4", "isSelect": false }, 
            { "subType": "家教助教4", "title": "家教助教4", "isSelect": false }, 
            { "subType": "快递配送4", "title": "快递配送4", "isSelect": false }
        ], 
        "跑腿办事": [
            { "subType": "传单派发5", "title": "传单派发5", "isSelect": false }, 
            { "subType": "临时工5", "title": "临时工5", "isSelect": false }, 
            { "subType": "服务员5", "title": "服务员5", "isSelect": false }, 
            { "subType": "家教助教5", "title": "家教助教5", "isSelect": false }, 
            { "subType": "快递配送5", "title": "快递配送5", "isSelect": false }
        ],
        "演绎达人": [
            { "subType": "传单派发6", "title": "传单派发6", "isSelect": false }, 
            { "subType": "临时工6", "title": "临时工6", "isSelect": false }, 
            { "subType": "服务员6", "title": "服务员6", "isSelect": false }, 
            { "subType": "家教助教6", "title": "家教助教6", "isSelect": false }, 
            { "subType": "快递配送6", "title": "快递配送6", "isSelect": false }
        ],  
    };

    Map topicalSleItem = { "type": "热门", "title": "热门", "isSelect": true };
    List<Map> postUsedItems = [
        { "subType": "传单派发0", "title": "传单派发0", "isSelect": false }, 
        { "subType": "临时工0", "title": "临时工0", "isSelect": false }, 
        { "subType": "服务员0", "title": "服务员0", "isSelect": false }, 
        { "subType": "家教助教0", "title": "家教助教0", "isSelect": false }, 
        { "subType": "快递配送0", "title": "快递配送0", "isSelect": false }
    ];

    @override
    Widget build(BuildContext context) {
        double screenWidth = MediaQuery.of(context).size.width;
        return Scaffold(
            backgroundColor: Color.fromRGBO(228,230,233,1),
            appBar: AppBar(
                title: Text(widget.title),
            ),
            body: Container(
                margin: EdgeInsets.fromLTRB(15, 15, 15, 39),
                decoration: BoxDecoration(borderRadius: BorderRadius.circular(3), color: Colors.white),
                child: Column(
                    children: [
                        Container(
                            margin: EdgeInsets.fromLTRB(0, 15, 0, 20),
                            alignment: Alignment.center,
                            child: Text('请选择您感兴趣的领域', style: TextStyle( fontSize: 14, fontWeight: FontWeight.bold, color: Color.fromRGBO(0, 0, 0, 1))),
                        ),
                        Row(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                                Container(
                                    width: 123,
                                    alignment: Alignment.topLeft,
                                    decoration: BoxDecoration(border: Border(right: BorderSide(width: 1, color: Color.fromRGBO(228,230,233,0.65)))),
                                    child: Column(
                                        children: _getTopicalWidgetItem()
                                    ),
                                ),
                                Container(
                                    width: screenWidth - 154,
                                    alignment: Alignment.topLeft,
                                    child: Wrap(
                                        spacing: 0,
                                        children: _getPostWidgetItems((screenWidth - 199)/2.0)
                                    ),
                                )
                            ],
                        )
                    ],
                ),
            ),
        );
    }

    _getTopicalWidgetItem() {
         return (topicalData.map((item){
            return (PPInterestOptionsTopicalItem(data: item, itemWidth: 143, action: _onClickTopicalItem));
        }).toList());
    }

    _getPostWidgetItems(double itemWidth) {
        return (postUsedItems.map((item){
            return (PPInterestOptionsPostItem(type: topicalSleItem["type"], itemWidth: itemWidth, data: item, action: _onClickPostWidget));
        }).toList());
    }

    _onClickTopicalItem(item) {
        List<Map> topicalList = [];
        Map topicalSelData = topicalSleItem;
        bool isRefreash = true;
        topicalData.forEach((objc) {
            if(objc["type"] == item["type"]) {
                isRefreash = !objc["isSelect"];
                objc["isSelect"] = true;
                topicalSelData = objc;
            } else {
                objc["isSelect"] = false;
            }
            topicalList.add(objc);
        });
        List<Map> postList = postData[item["type"]];
        if(isRefreash) {
            setState(() {
                topicalData = topicalList;
                topicalSleItem = topicalSelData;
                postUsedItems = postList;
            });
        }
    }

    _onClickPostWidget(item, type) { // 多选处理
        if(topicalSleItem["type"] == type) {
            List<Map> list = [];
            postData[type].forEach((objc) {
                if(objc["subType"] == item["subType"]) {
                    objc["isSelect"] = !item["isSelect"];
                }
                list.add(objc);
            });
            setState(() {
                postUsedItems = list;
            });
        }
    }
}